<!-- /.aside -->
<div style="width:500px" id="category-child-list">

  <aside class="aside bg-light nav-s" style="height: 700px;width: 100px;float:left" id="sidebar">
    <section class="vbox animated fadeInUp">
      <section class="scrollable hover">
        <div class="list-group no-radius no-border no-bg m-t-n-xxs m-b-none auto">
          <!--  <a href="genres.html" class="list-group-item">
              All
            </a>-->
          <a  *ngFor="let category of categoryListTwo; index as i; first as isFirst" data-toggle="class:nav-s,nav-s,open" class="list-group-item " >
            <a (click)="toCategoryNavTwo(category.id,i)">{{category.name}}</a>
          </a>
          <!--      <a href="#sidebar2" data-toggle="class:nav-s,nav-s,open" class="list-group-item " >
                  ambient
                </a>
                <a href="#sidebar2" data-toggle="class:nav-s,nav-s,open" class="list-group-item " >
                  blues
                </a>
                <a href="#sidebar2" data-toggle="class:nav-s,nav-s,open" class="list-group-item " >
                  classical
                </a>
                <a href="#sidebar2" data-toggle="class:nav-s,nav-s,open" class="list-group-item " >
                  country
                </a>
                <a href="#sidebar2" data-toggle="class:nav-s,nav-s,open" class="list-group-item " >
                  electronic
                </a>
                <a href="#sidebar2" data-toggle="class:nav-s,nav-s,open" class="list-group-item " >
                  emo
                </a>
                <a href="#sidebar2" data-toggle="class:nav-s,nav-s,open" class="list-group-item " >
                  folk
                </a>
                <a href="#sidebar2" data-toggle="class:nav-s,nav-s,open" class="list-group-item " >
                  hardcore
                </a>
                <a href="#sidebar2" data-toggle="class:nav-s,nav-s,open" class="list-group-item " >
                  hip hop
                </a>
                <a href="#sidebar2" data-toggle="class:nav-s,nav-s,open" class="list-group-item " >
                  indie
                </a>
                <a href="#sidebar2" data-toggle="class:nav-s,nav-s,open" class="list-group-item " >
                  jazz
                </a>
                <a href="#sidebar2" data-toggle="class:nav-s,nav-s,open" class="list-group-item " >
                  latin
                </a>
                <a href="#sidebar2" data-toggle="class:nav-s,nav-s,open" class="list-group-item " >
                  metal
                </a>
                <a href="#sidebar2" data-toggle="class:nav-s,nav-s,open" class="list-group-item " >
                  pop
                </a>
                <a href="#sidebar2" data-toggle="class:nav-s,nav-s,open" class="list-group-item " >
                  pop punk
                </a>
                <a href="#sidebar2" data-toggle="class:nav-s,nav-s,open" class="list-group-item " >
                  punk
                </a>
                <a href="#sidebar2" data-toggle="class:nav-s,nav-s,open" class="list-group-item " >
                  reggae
                </a>
                <a href="#sidebar2" data-toggle="class:nav-s,nav-s,open" class="list-group-item " >
                  rnb
                </a>
                <a href="#sidebar2" data-toggle="class:nav-s,nav-s,open" class="list-group-item " >
                  rock
                </a>
                <a href="#sidebar2" data-toggle="class:nav-s,nav-s,open" class="list-group-item " >
                  soul
                </a>
                <a href="#sidebar2" data-toggle="class:nav-s,nav-s,open" class="list-group-item " >
                  world
                </a>-->
        </div>
      </section>
    </section>
  </aside>
  <aside class="aside bg-light nav-s"  style="height:700px;width: 100px;float:left" id="sidebar2">
    <section class="vbox animated fadeInUp">
      <section class="scrollable hover">
        <div class="list-group no-radius no-border no-bg m-t-n-xxs m-b-none auto">
          <a  *ngFor="let category of categoryListThree; index as i; first as isFirst"  class="list-group-item">
            <a (click)="toPage(category.id)">{{category.name}}</a>
          </a>

       </div>
      </section>
    </section>
  </aside>
</div>
